<%-- 
    Document   : index
    Created on : Oct 29, 2013, 8:09:23 AM
    Author     : MeoMupU
--%>
<%@page import="mysql.DataProvider"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="mysql.MySQLConnect" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<% 
    ResultSet rs;
%>
<!DOCTYPE html>
<html lang="en">
    <head>

        <!-- start: Meta -->
        <meta charset="utf-8">
        <title>Beautiful Deal</title>
        <meta name="description" content="Beautiful Deal Bootstrap Admin Template.">
        <meta name="author" content="Łukasz Holeczek">
        <!-- end: Meta -->

        <!-- start: Mobile Specific -->
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!-- end: Mobile Specific -->

        <!-- start: CSS -->
        <link href="../template/css/bootstrap-combined.min.css" rel="stylesheet">
        <link id="bootstrap-style" href="../template/css/bootstrap.min.css" rel="stylesheet">
        <link href="../template/css/bootstrap-responsive.min.css" rel="stylesheet">
        <link href="../template/css/mystyle.css" rel="stylesheet">
        <link id="base-style" href="../template/css/style.css" rel="stylesheet">
        <link id="base-style-responsive" href="../template/css/style-responsive.css" rel="stylesheet">

        <!--[if lt IE 7 ]>
        <link id="ie-style" href="../template/css/style-ie.css" rel="stylesheet">
        <![endif]-->
        <!--[if IE 8 ]>
        <link id="ie-style" href="../template/css/style-ie.css" rel="stylesheet">
        <![endif]-->
        <!--[if IE 9 ]>
        <![endif]-->

        <!-- end: CSS -->


        <!-- The HTML5 shim, for IE6-8 support of HTML5 elements -->
        <!--[if lt IE 9]>
          <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->

        <!-- start: Favicon -->
        <link rel="shortcut icon" href="img/favicon.ico">
        <!-- end: Favicon -->




    </head>

    <body>
        <div id="overlay">
            <ul>
                <li class="li1"></li>
                <li class="li2"></li>
                <li class="li3"></li>
                <li class="li4"></li>
                <li class="li5"></li>
                <li class="li6"></li>
            </ul>
        </div>	
        <!-- start: Header -->
        <%@include file="include/header.jsp" %>
        <!-- end: Header -->
        <div class="container-fluid">
            <div class="row-fluid">

                <!-- start: Main Menu -->
                <%@include file="include/mainmenu.jsp" %>
                <!-- end: Main Menu -->

                <noscript>
                <div class="alert alert-block span10">
                    <h4 class="alert-heading">Warning!</h4>
                    <p>You need to have <a href="http://en.wikipedia.org/wiki/JavaScript" target="_blank">JavaScript</a> enabled to use this site.</p>
                </div>
                </noscript>

                <div id="content" class="span10">
                    <!-- start: Content -->

                    <div>
                        <hr>
                        <ul class="breadcrumb">
                            <li>
                                <a href="../page/index.jsp">Trang Chủ</a> <span class="divider">/</span>
                            </li>
                            <li>
                                <a href="#">...</a>
                            </li>
                        </ul>
                        <hr>
                    </div>

                    <div id="feature_product" class="feature_product">
                        <h2 class="">DEAL MỚI HÔM NAY</h2>
                        <div id="AjaxProduct" totalPage="<%= DataProvider.getTotalPageToday()%>">
                            <!-- code product here -->

                            <%
                                rs = DataProvider.loadTodayProduct(1);
                                int i=0;
                                if(rs!=null){
                                    while (rs.next()) {
                                        if(i==0)
                                            out.write("<div class='row-fluid row-product'>");
                            %>
                            <div class="list-rands-over span3">
                                <div class="list-rands">
                                    <div class="box-frame-center">
                                        <div lang="41657" class="v6ItemHotImg v7Relative">

                                            <a href="#">
                                                <div class="v7price_promotion fixPNG"><%= DataProvider.getDiscout(rs.getString("GiaGoc"), rs.getString("GiaBan")) %><span>%</span></div>
                                                <img width="290" height="290" alt="Son Naris White" src="<%= rs.getString("HinhChinh")%>">
                                            </a>
                                            <div class="v7InfoType">
                                                <div class="c"></div>
                                            </div>
                                        </div> 
                                        <div class="v6ContentHot">
                                            <div align="left" class="titledeals2">
                                                <a href="#" title="Xem chi tiết deal"><%= rs.getString("TenSP") %></a> 
                                            </div>
                                        </div>
                                        <div class="v6TopBorder fixPNG">
                                            <div class="fl v7prices mTop3">
                                                <div class="v7PromotionBigSold"><%= rs.getString("GiaBan") %><span>đ</span></div>
                                                <div class="v7bnew mTop10">Đã mua: <b><%= rs.getString("LuotMua") %></b></div>
                                            </div>
                                            <a href="#" class="v7view fr fixPNG mTop20"><img width="61" height="30" src="../template/img/blank.gif"></a>
                                            <div class="c"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <%
                                        i++;
                                        if(i>3){
                                            out.write("</div><!--/fluid-row row-product-->");
                                            i=0;
                                        }
                                }
                                // dong div cuoi cung
                                    if(i>0 && i < 4)
                                        out.write("</div><!--/fluid-row row-product-->");
                                }else{
                                    out.write("<div class='row-fluid row-product'>");
                                    out.write("<small>Chưa có dữ liệu</small>");
                                    out.write("</div><!--/fluid-row row-product-->");
                                }
                            %>
                        </div>
                    </div>
                    <div id="Paging" class="fluid-row">

                    </div>
                    

                    <!-- end: Content -->

                </div><!--/#content.span10-->


                <div class="modal hide fade" id="myModal">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal">×</button>
                        <h3>Settings</h3>
                    </div>
                    <div class="modal-body">
                        <p>Here settings can be configured...</p>
                    </div>
                    <div class="modal-footer">
                        <a href="#" class="btn" data-dismiss="modal">Close</a>
                        <a href="#" class="btn btn-primary">Save changes</a>
                    </div>
                </div>

                <div class="clearfix"></div>

                <footer>
                    <p>
                        <span style="text-align:left;float:left">&copy; <a href="http://clabs.co" target="_blank">creativeLabs</a> 2013</span>
                        <span style="text-align:right;float:right">Powered by: <a href="#">Beautiful Deal</a></span>
                    </p>

                </footer>

            </div><!--/.fluid-container-->

            <!-- start: JavaScript-->

            <script src="../template/js/jquery-1.9.1.min.js"></script>

            <script src="../template/js/jquery-migrate-1.0.0.min.js"></script>

            <script src="../template/js/jquery-ui-1.10.0.custom.min.js"></script>

            <script src="../template/js/jquery.ui.touch-punch.js"></script>

            <script src="../template/js/bootstrap.min.js"></script>

            <script src="../template/js/jquery.cookie.js"></script>

            <script src="../template/js/fullcalendar.min.js"></script>

            <script src="../template/js/jquery.dataTables.min.js"></script>

            <script src="../template/js/excanvas.js"></script>

            <script src="../template/js/jquery.flot.min.js"></script>

            <script src="../template/js/jquery.flot.pie.min.js"></script>

            <script src="../template/js/jquery.flot.stack.js"></script>

            <script src="../template/js/jquery.flot.resize.min.js"></script>

            <script src="../template/js/jquery.chosen.min.js"></script>

            <script src="../template/js/jquery.uniform.min.js"></script>

            <script src="../template/js/jquery.cleditor.min.js"></script>

            <script src="../template/js/jquery.noty.js"></script>

            <script src="../template/js/jquery.elfinder.min.js"></script>

            <script src="../template/js/jquery.raty.min.js"></script>

            <script src="../template/js/jquery.iphone.toggle.js"></script>

            <script src="../template/js/jquery.uploadify-3.1.min.js"></script>

            <script src="../template/js/jquery.gritter.min.js"></script>

            <script src="../template/js/jquery.imagesloaded.js"></script>

            <script src="../template/js/jquery.masonry.min.js"></script>

            <script src="../template/js/jquery.knob.js"></script>

            <script src="../template/js/jquery.sparkline.min.js"></script>
            
            <script src="../template/js/bootstrap-paginator.js"></script>

            <script src="../template/js/custom.js"></script>
            <script type="text/javascript">
                $(document).ready(function() {
                    var options = {
                    currentPage: 1,
                    totalPages: $('#AjaxProduct').attr('totalPage'),
                    onPageClicked: function(e, originalEvent, type, page){
                    $.ajax({
                    type: "POST",
                            url: "/page/ajaxProduct.jsp",
                            data: {page: page,type:3},
                            beforeSend: function() {
                            //$('#AjaxProduct').html("<img src='../template/img/loading.gif' />");
                            $('#AjaxProduct').animate({opacity: 0.25});
                            },
                            success: function(html) {
                            $('#AjaxProduct').html(html);
                                    $('#AjaxProduct').animate({opacity: 1});
                            }
                    });
                    }
                    };
                    $('#Paging').bootstrapPaginator(options);
                 });
            </script>
            <!-- end: JavaScript-->

    </body>
</html>
